import { useEffect, useState } from 'react'
import axios from 'axios'
/**

* 自定义hooks
 * 作用：状态逻辑复用
 * 语法：useXXX() 
 * 说明❓： 自定义hooks钩子函数  必须以use开头，函数内部使用官方提供的钩子函数（useState、useEffect等）
 */

const useList = () => {
  /**
  * 需求：获取http://ajax-api.itheima.net/api/news数据并渲染
  * 思考❓：请求查询数据，什么时候发送？=》组件挂载查询一次 =》使用依赖 空数组[]
  * react 这里就是effcet 规定不能是异步的
  */
  const [list, setList] = useState([])
  useEffect(() => {
    //写法1：
    //1 定义发请求方法
    // const getNews = async () => {
    //   const { data } = await axios.get('http://ajax-api.itheima.net/api/news')
    //   console.log('后台新闻：', data)
    //   setList(data.data)
    // }
    // //调用
    // getNews()
    //写法2  ：借助函数自调用iife（立即执行函数表达式）(()=>{})  ()这种形式
    ; (async () => {
      const { data } = await axios.get('http://ajax-api.itheima.net/api/news')
      console.log('后台新闻：', data)
      setList(data.data)
    })()
  }, [])
  return list
}

export { useList }